<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:p="http://primefaces.org/ui"
                template="./../../resources/templates/template.xhtml">

    <ui:define name="header">
        <style type="text/css">
            .bottom-command-right
            {
                width: 100%;
                text-align: right;
                padding-right: 10px;
            }
            
            .command-column
            {
                width: 40px;
            }
        </style>
    </ui:define>

    <ui:define name="content">
        <p:fieldset legend="Gerenciar atividades" >
            <h:form id="frmAtividades">
                <!-- Exibição de mensagens gerais -->
                <p:growl id="gMessages" 
                         sticky="false" 
                         globalOnly="true" />

                <p:outputPanel>
                    <h:outputLabel value="Nenhum evento foi selecionado."
                                   style="color: #ff0000"
                                   rendered="#{empty param.ie}"/>
                </p:outputPanel>
                <p:outputPanel>
                    <p:panel header="Atividades"
                             rendered="#{not empty param.ie}">
                        <div class="bottom-command-right">
                            <p:commandButton value="Novo"
                                             icon="ui-icon-circle-plus"
                                             iconPos="left"
                                             actionListener="#{atividadeBean.onNovaAtividade}"
                                             update=":frmAtividades:dlgAtividade"
                                             process="@this"
                                             oncomplete="dlgAtividade.show();"/>
                        </div>
                        <p:dataTable id="dtAtividades" 
                                     value="#{atividadeBean.atividades}"
                                     var="atividade"
                                     paginator="true" 
                                     rows="5" 
                                     rowsPerPageTemplate="5, 10"
                                     paginatorPosition="bottom"
                                     paginatorTemplate="{FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
                                     emptyMessage="Não há atividades cadastradas no evento.">
                            <p:column styleClass="command-column">
                                <f:facet name="header">
                                    Editar
                                </f:facet>
                                <p:commandButton id="cbEditarAtividade" 
                                                 alt="Editar este evento" 
                                                 icon="ui-icon-pencil"
                                                 process="@this"
                                                 update=":frmAtividades:dlgAtividade"
                                                 oncomplete="dlgAtividade.show();">
                                    <f:setPropertyActionListener target="#{atividadeBean.atividade}"
                                                                 value="#{atividade}" />
                                    <f:setPropertyActionListener target="#{atividadeBean.novo}"
                                                                 value="#{false}" />
                                </p:commandButton>
                            </p:column>

                            <p:column styleClass="command-column">
                                <f:facet name="header">
                                    Excluir
                                </f:facet>
                                <p:commandButton alt="Excluir este evento" 
                                                 icon="ui-icon-close"
                                                 process="@this"/>
                            </p:column>

                            <p:column styleClass="command-column">
                                <f:facet name="header">
                                    Recursos
                                </f:facet>
                                <p:commandButton alt="Gerenciar os recursos dessa atividade" 
                                                 icon="ui-icon-close"
                                                 process="@this"/>
                            </p:column>

                            <p:column styleClass="command-column">
                                <f:facet name="header">
                                    Serviços
                                </f:facet>
                                <p:commandButton alt="Gerenciar os serviços dessa atividade" 
                                                 icon="ui-icon-close"
                                                 process="@this"/>
                            </p:column>

                            <p:column>
                                <f:facet name="header">
                                    Atividade
                                </f:facet>
                                <h:outputLabel value="#{atividade.nmeAtividade}"
                                               styleClass="t3"/>
                                <p:separator />
                                <div class="bottom-command-right">
                                    <h:outputLabel value="De:" />
                                    <h:outputLabel value="#{atividade.dtaInicioAtividade}" converter="dataConversor" />
                                    <h:outputLabel value="à" />
                                    <h:outputLabel value="#{atividade.dtaInicioAtividade}" converter="dataConversor" />
                                </div>
                                <p:panelGrid columns="2"
                                             styleClass="gridNoLine">
                                    <h:outputLabel value="Descrição: "/>
                                    <h:outputLabel value="#{atividade.dscAtividade}"/>
                                    <h:outputLabel value="Tipo: "/>
                                    <h:outputLabel value="#{atividade.tdTipoAtividade.nmeTipoAtividade}"/>
                                </p:panelGrid>
                            </p:column>

                        </p:dataTable>
                    </p:panel>
                </p:outputPanel>

                <p:dialog id="dlgAtividade"
                          modal="true"
                          resizable="true"
                          widgetVar="dlgAtividade"
                          header="#{atividadeBean.tituloJanela}">
                    <p:panelGrid columns="2"
                                 styleClass="gridNoLine">
                        <p:messages id="mAtividade" 
                                    closable="true"
                                    autoUpdate="true"
                                    redisplay="false" />
                        <p:panelGrid columns="2">

                            <h:outputLabel value="* Nome:" />
                            <p:inputText value="#{atividadeBean.atividade.nmeAtividade}"
                                         required="true"
                                         requiredMessage="Informe o nome da atividade."
                                         maxlength="80"/>

                            <h:outputLabel value="* Tipo:" />
                            <p:selectOneMenu value="#{atividadeBean.atividade.tdTipoAtividade}"
                                             required="true"
                                             requiredMessage="Selecione o tipo da atividade.">
                                <f:converter converterId="tipoAtividadeConversor" />
                                <f:selectItem itemLabel="Selecione..."
                                              itemValue="" />
                                <f:selectItems value="#{atividadeBean.tiposAtividade}"
                                               var="tipo"
                                               itemLabel="#{tipo.nmeTipoAtividade}"
                                               itemValue="#{tipo}" />
                            </p:selectOneMenu>

                            <h:outputLabel value="* Descrição:" />
                            <p:inputTextarea value="#{atividadeBean.atividade.dscAtividade}"
                                             required="true"
                                             requiredMessage="Informe o descrição da atividade."
                                             maxlength="250"
                                             styleClass="no-resize"/>

                            <h:outputLabel value="* Data de início:" />
                            <p:calendar id="cDataInicio" 
                                        value="#{atividadeBean.atividade.dtaInicioAtividade}" 
                                        showOn="button"
                                        locale="pt" 
                                        required="true"
                                        requiredMessage="Selecione a data de início do evento."
                                        pattern="dd/MM/yyyy HH:mm"
                                        stepMinute="10"
                                        label="Data de início:">
                                <p:ajax event="dateSelect"
                                        update=":frmAtividades:cDataTermino" /> 
                            </p:calendar>

                            <h:outputLabel value="* Data de término:" />
                            <p:calendar id="cDataTermino"
                                        value="#{atividadeBean.atividade.dtaTerminoAtividade}" 
                                        showOn="button"
                                        locale="pt"
                                        required="true"
                                        requiredMessage="Selecione a data de término do evento."
                                        mindate="#{atividadeBean.atividade.dtaInicioAtividade}"
                                        minHour="#{atividadeBean.atividade.dtaInicioAtividade.hours}"
                                        pattern="dd/MM/yyyy HH:mm"
                                        stepMinute="10"
                                        label="Data de término:">
                                <p:ajax event="dateSelect"
                                        update=":frmAtividades:cDataInicio" /> 
                            </p:calendar>
                            <!-- Marcador -->
                            <p:commandButton value="Salvar"
                                             process=":frmAtividades:dlgAtividade @this"
                                             update=":frmAtividades:gMessages :frmAtividades:dlgAtividade :frmAtividades:dtAtividades"
                                             actionListener="#{atividadeBean.onSalvarAtividade}">

                            </p:commandButton>
                        </p:panelGrid>
                    </p:panelGrid>
                </p:dialog>
            </h:form>
        </p:fieldset>
    </ui:define>

</ui:composition>
